import { setHeaders, get, post, put, del } from './http.js';

$(document).ready(function () {
    // 点击登录按钮打开登录框
    $('.btn-login, .top-links a:contains("登录")').click(function (e) {
        e.preventDefault();
        $('#loginModal').fadeIn(300);
        $('body').css('overflow', 'hidden');
    });

    // 点击关闭按钮关闭登录框
    $('.close-btn').click(function () {
        $('#loginModal').fadeOut(300);
        $('body').css('overflow', 'auto');
    });

    // 点击模态框外部区域关闭登录框
    $('#loginModal').click(function (e) {
        if (e.target === this) {
            $(this).fadeOut(300);
            $('body').css('overflow', 'auto');
        }
    });

    // ESC 键关闭登录框
    $(document).keydown(function (e) {
        if (e.key === 'Escape' && $('#loginModal').is(':visible')) {
            $('#loginModal').fadeOut(300);
            $('body').css('overflow', 'auto');
        }
    });

    // 表单验证
    const loginForm = {
        username: $('#username'),
        password: $('#password'),
        loginBtn: $('.login-btn'),

        // 显示错误信息
        showError: function (element, message) {
            element.addClass('error');
            element.siblings('.error-msg').text(message);
        },

        // 清除错误信息
        clearError: function (element) {
            element.removeClass('error');
            element.siblings('.error-msg').text('');
        },

        // 验证用户名
        validateUsername: function () {
            const username = this.username.val().trim();
            if (!username) {
                this.showError(this.username, '请输入账号/手机号/邮箱');
                return false;
            }

            // 可以添加更详细的验证规则
            if (username.length < 3) {
                this.showError(this.username, '账号长度不能少于3个字符');
                return false;
            }

            this.clearError(this.username);
            return true;
        },

        // 验证密码
        validatePassword: function () {
            const password = this.password.val().trim();
            if (!password) {
                this.showError(this.password, '请输入密码');
                return false;
            }

            if (password.length < 6) {
                this.showError(this.password, '密码长度不能少于6个字符');
                return false;
            }

            this.clearError(this.password);
            return true;
        },

        // 验证所有字段
        validateAll: function () {
            return this.validateUsername() && this.validatePassword();
        }
    };

    // 输入框失去焦点时验证
    $('#username').blur(function () {
        loginForm.validateUsername();
    });

    $('#password').blur(function () {
        loginForm.validatePassword();
    });

    // 输入时清除错误提示
    $('#username, #password').on('input', function () {
        loginForm.clearError($(this));
    });

    // 处理登录按钮点击
    $('.login-btn').click(function () {
        if (!loginForm.validateAll()) {
            return;
        }

        // 禁用登录按钮，显示加载状态
        const $btn = $(this);
        $btn.prop('disabled', true).text('登录中...');

        // 模拟登录请求
        const username = $('#username').val().trim();
        const password = $('#password').val().trim();

        post('/api/auth/login', { username, password })
            .then(data => {
                console.log('登录成功:', data);

                $('#loginModal').fadeOut(300);
                $('body').css('overflow', 'auto');

                // 更新用户状态（示例）
                $('.user-welcome').text('Hi，' + username);
                $('.user-btns').hide();

                // 恢复按钮状态
                $btn.prop('disabled', false).text('登录');

                // 清空表单
                $('#username, #password').val('');

                localStorage.setItem('token', data.token);
            })
            .catch(error => {
                debugger
                console.error('登录失败:', error.message);
            });
    });

    // 忘记密码相关逻辑
    $('.forget-pwd').click(function (e) {
        e.preventDefault();
        // 关闭登录框，打开忘记密码框
        $('#loginModal').fadeOut(300);
        $('#forgetModal').fadeIn(300);
    });

    // 关闭忘记密码框
    $('#forgetModal .close-btn').click(function () {
        $('#forgetModal').fadeOut(300);
        $('body').css('overflow', 'auto');
    });

    // 点击忘记密码模态框外部区域关闭
    $('#forgetModal').click(function (e) {
        if (e.target === this) {
            $(this).fadeOut(300);
            $('body').css('overflow', 'auto');
        }
    });

    // 发送验证码
    let countdown = 60;
    let timer = null;

    function startCountdown($btn) {
        $btn.prop('disabled', true).addClass('disabled');
        timer = setInterval(function () {
            if (countdown > 0) {
                $btn.text(`${countdown}秒后重新获取`);
                countdown--;
            } else {
                clearInterval(timer);
                $btn.prop('disabled', false).removeClass('disabled').text('获取验证码');
                countdown = 60;
            }
        }, 1000);
    }

    $('.send-code-btn').click(function () {
        const phone = $('#forgetPhone').val().trim();
        const phoneReg = /^1[3-9]\d{9}$/;

        if (!phoneReg.test(phone)) {
            $('#forgetPhone').siblings('.error-msg').text('请输入正确的手机号');
            return;
        }

        // 这里应该发送验证码请求
        // $.ajax({...});

        // 开始倒计时
        startCountdown($(this));
    });

    // 表单验证
    const forgetForm = {
        // 显示错误信息
        showError: function (element, message) {
            element.addClass('error');
            element.siblings('.error-msg').text(message);
        },

        // 清除错误信息
        clearError: function (element) {
            element.removeClass('error');
            element.siblings('.error-msg').text('');
        },

        validatePhone: function () {
            const phone = $('#forgetPhone').val().trim();
            const phoneReg = /^1[3-9]\d{9}$/;
            if (!phoneReg.test(phone)) {
                this.showError($('#forgetPhone'), '请输入正确的手机号');
                return false;
            }
            this.clearError($('#forgetPhone'));
            return true;
        },

        validateCode: function () {
            const code = $('#verifyCode').val().trim();
            if (!/^\d{6}$/.test(code)) {
                this.showError($('#verifyCode'), '请输入6位验证码');
                return false;
            }
            this.clearError($('#verifyCode'));
            return true;
        },

        validatePassword: function () {
            const password = $('#newPassword').val().trim();
            if (!password) {
                this.showError($('#newPassword'), '请输入新密码');
                return false;
            }
            if (password.length < 6) {
                this.showError($('#newPassword'), '密码长度不能少于6位');
                return false;
            }
            this.clearError($('#newPassword'));
            return true;
        },

        validateConfirmPassword: function () {
            const confirmPassword = $('#confirmPassword').val().trim();
            if (!confirmPassword) {
                this.showError($('#confirmPassword'), '请确认新密码');
                return false;
            }
            const password = $('#newPassword').val().trim();
            if (password !== confirmPassword) {
                this.showError($('#confirmPassword'), '两次输入的密码不一致');
                return false;
            }
            this.clearError($('#confirmPassword'));
            return true;
        },

        // 添加验证所有字段的方法
        validateAll: function () {
            const isPhoneValid = this.validatePhone();
            const isCodeValid = this.validateCode();
            const isPasswordValid = this.validatePassword();
            const isConfirmPasswordValid = this.validateConfirmPassword();

            return isPhoneValid && isCodeValid && isPasswordValid && isConfirmPasswordValid;
        }
    };

    // 输入框事件处理
    $('#forgetPhone, #verifyCode, #newPassword, #confirmPassword').on('input', function () {
        forgetForm.clearError($(this));
    });

    // 输入框失去焦点时验证
    $('#forgetPhone').blur(function () {
        forgetForm.validatePhone();
    });

    $('#verifyCode').blur(function () {
        forgetForm.validateCode();
    });

    $('#newPassword').blur(function () {
        forgetForm.validatePassword();
    });

    $('#confirmPassword').blur(function () {
        forgetForm.validateConfirmPassword();
    });

    // 修改提交按钮的点击处理
    $('.submit-btn').click(function () {
        // 验证所有字段
        if (!forgetForm.validateAll()) {
            return;
        }

        const $btn = $(this);
        $btn.prop('disabled', true).text('提交中...');

        // 获取表单数据
        const formData = {
            phone: $('#forgetPhone').val().trim(),
            code: $('#verifyCode').val().trim(),
            password: $('#newPassword').val().trim(),
            confirmPassword: $('#confirmPassword').val().trim()
        };

        // 模拟提交请求
        setTimeout(function () {
            // 这里应该是实际的 Ajax 请求
            // $.ajax({
            //     url: '/api/reset-password',
            //     method: 'POST',
            //     data: formData,
            //     success: function(response) {
            //         // 处理成功响应
            //     },
            //     error: function(error) {
            //         // 处理错误响应
            //     }
            // });

            alert('密码重置成功！');

            // 关闭忘记密码框，打开登录框
            $('#forgetModal').fadeOut(300);
            $('#loginModal').fadeIn(300);

            // 清空表单
            $('#forgetPhone, #verifyCode, #newPassword, #confirmPassword').val('');
            $('.error-msg').text('');

            // 恢复按钮状态
            $btn.prop('disabled', false).text('重置密码');
        }, 1500);
    });

    // 添加密码输入框的实时验证
    $('#newPassword').on('input', function () {
        if ($('#confirmPassword').val().trim()) {
            forgetForm.validateConfirmPassword();
        }
    });

    $('#confirmPassword').on('input', function () {
        if ($(this).val().trim()) {
            forgetForm.validateConfirmPassword();
        }
    });

    // 注册相关的代码
    const registerForm = {
        showError: function (element, message) {
            element.addClass('error');
            element.siblings('.error-msg').text(message);
        },

        clearError: function (element) {
            element.removeClass('error');
            element.siblings('.error-msg').text('');
        },

        validatePhone: function () {
            const phone = $('#regPhone').val().trim();
            const phoneReg = /^1[3-9]\d{9}$/;
            if (!phoneReg.test(phone)) {
                this.showError($('#regPhone'), '请输入正确的手机号');
                return false;
            }
            this.clearError($('#regPhone'));
            return true;
        },

        validateCode: function () {
            const code = $('#regVerifyCode').val().trim();
            if (!/^\d{6}$/.test(code)) {
                this.showError($('#regVerifyCode'), '请输入6位验证码');
                return false;
            }
            this.clearError($('#regVerifyCode'));
            return true;
        },

        validatePassword: function () {
            const password = $('#regPassword').val().trim();
            if (!password) {
                this.showError($('#regPassword'), '请设置登录密码');
                return false;
            }
            if (password.length < 6) {
                this.showError($('#regPassword'), '密码长度不能少于6位');
                return false;
            }
            this.clearError($('#regPassword'));
            return true;
        },

        validateConfirmPassword: function () {
            const password = $('#regPassword').val().trim();
            const confirmPassword = $('#regConfirmPassword').val().trim();
            if (!confirmPassword) {
                this.showError($('#regConfirmPassword'), '请确认登录密码');
                return false;
            }
            if (password !== confirmPassword) {
                this.showError($('#regConfirmPassword'), '两次输入的密码不一致');
                return false;
            }
            this.clearError($('#regConfirmPassword'));
            return true;
        },

        validateAll: function () {
            return this.validatePhone() &&
                this.validateCode() &&
                this.validatePassword() &&
                this.validateConfirmPassword() &&
                $('#agreeTerms').prop('checked');
        }
    };

    // 打开注册框
    $('.btn-register, .top-links a:contains("注册")').click(function (e) {
        e.preventDefault();
        $('#loginModal').fadeOut(300);
        $('#registerModal').fadeIn(300);
    });

    // 关闭注册框
    $('#registerModal .close-btn').click(function () {
        $('#registerModal').fadeOut(300);
    });

    // 切换到登录
    $('.switch-login').click(function () {
        $('#registerModal').fadeOut(300);
        $('#loginModal').fadeIn(300);
    });

    // 验证码倒计时
    let regCountdown = 60;
    let regTimer = null;

    function startRegCountdown($btn) {
        $btn.prop('disabled', true).addClass('disabled');
        regTimer = setInterval(function () {
            if (regCountdown > 0) {
                $btn.text(`${regCountdown}秒后重新获取`);
                regCountdown--;
            } else {
                clearInterval(regTimer);
                $btn.prop('disabled', false).removeClass('disabled').text('获取验证码');
                regCountdown = 60;
            }
        }, 1000);
    }

    // 发送验证码
    $('#registerModal .send-code-btn').click(function () {
        if (!registerForm.validatePhone()) {
            return;
        }
        startRegCountdown($(this));
    });

    // 输入框事件
    $('#regPhone, #regVerifyCode, #regPassword, #regConfirmPassword').on('input', function () {
        registerForm.clearError($(this));
        updateRegisterButton();
    });

    // 复选框变化事件
    $('#agreeTerms').change(function () {
        updateRegisterButton();
    });

    // 更新注册按钮状态
    function updateRegisterButton() {
        $('.register-submit-btn').prop('disabled', !registerForm.validateAll());
    }

    // 注册表单提交
    $('.register-submit-btn').click(function () {
        if (!registerForm.validateAll()) {
            return;
        }

        const $btn = $(this);
        $btn.prop('disabled', true).text('注册中...');

        // 模拟注册请求
        setTimeout(function () {
            alert('注册成功！');
            $('#registerModal').fadeOut(300);
            $('#loginModal').fadeIn(300);

            // 清空表单
            $('#regPhone, #regVerifyCode, #regPassword, #regConfirmPassword').val('');
            $('#agreeTerms').prop('checked', false);
            $('.error-msg').text('');

            // 恢复按钮状态
            $btn.prop('disabled', false).text('注册');
        }, 1500);
    });
}); 